<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>详情</title>
    <link rel="stylesheet" href="${ctxPath}/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="${ctxPath}/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${ctxPath}/css/common.css">
    <link rel="stylesheet" href="${ctxPath}/css/topic.css">
</head>
<body>
<jsp:include page="/WEB-INF/pages/commons/header.jsp"></jsp:include>

<%--面包屑导航条--%>
<nav class="list">
    <a href="${ctxPath}/index.jsp">首页</a>
    <i>/</i>
    <b>话题详情</b>
</nav>

<%--当前页面主要内容--%>
<main class="topic-detail-container">
    <h3 class="topic-title">${topic.title}</h3>
    <div class="topic-author">${topic.author.nickname} 发布于 ${topic.publishTime}</div>
    <div class="topic-content">${topic.content}</div>
    <c:if test="${not empty sessionScope.customer}">
    <div class="row open-explain-page">
        <a href="${ctxPath}/topic/${topic.id}/explain" class="col-2 offset-10 btn btn-primary btn-sm">我来解答</a>
    </div>
    </c:if>
    <div class="topic-explains">
        <c:if test="${ empty topic.explains }">
            暂无解答
        </c:if>
        <c:if test="${ not empty topic.explains }">
            <c:forEach items="${topic.explains}" var="e" varStatus="x">
                <div class="explain">
                   <div class="row author-and-time">
                       <span class="col-2">${x.count}</span>
                       <span class="col-8">${e.author.nickname} 解答于 ${e.publishTime}</span>
                       <span class="col-2">
                           <a href="#" class="praise">
                               <i class="fa fa-thumbs-o-up}"></i>赞(${e.praise})
                           </a>
                           <a href="#" class="despise">
                               <i class="fa fa-thumbs-o-down"></i>踩(${e.despise})
                           </a>
                       </span>
                   </div>
                   <div>
                       ${e.content}
                   </div>
                </div>
            </c:forEach>
        </c:if>
    </div>
</main>

<jsp:include page="/WEB-INF/pages/commons/footer.jsp"></jsp:include>
</body>
</html>
